<!DOCTYPE html>
<html>
<head>
<meta name="layout" content="manage" />
<title>Home Page</title>
<asset:stylesheet rel="stylesheet" href="home/css/home.css" />
<asset:stylesheet rel="stylesheet" href="home/css/style.default.css" />

<asset:stylesheet rel="stylesheet" href="home/css/photo/style.css" />
<asset:stylesheet rel="stylesheet" href="home/css/uploadform.css" />
<asset:stylesheet rel="stylesheet" href="home/css/photo/hover.css" />
<asset:stylesheet rel="stylesheet prefetch"
	href="home/css/photo/photoswipe.css" />
<asset:stylesheet rel="stylesheet"
	href="fontawesome/css/font-awesome.min.css" />
<asset:stylesheet rel="stylesheet prefetch"
	href="home/css/photo/default-skin/default-skin.css" />

<asset:stylesheet rel="stylesheet" href="home/css/photo/grid.css" />
<asset:stylesheet rel="stylesheet" href="home/css/photo/main.css" />
</head>
<body>
	<div class="wrapper-manage">
		<div id="spinner" class="hidden"></div>
		<g:hiddenField name="currentPath" value="${currentPath}" />
		<!-- left panel -->
		<g:render template="/manage/managePartial/leftPanelPartial"></g:render>
		<!-- End left panel -->
		<!-- Right panel -->
		<div class="rightpanel">
			<ol class="breadcrumb">
				<li>Cloud Sharing</li>
			</ol>
			<g:render template="/photo/getListImages"></g:render>
		</div>
		<div style="clear: both;"></div>
		<g:render template="/photo/uploadImageForm"></g:render>
	</div>
	<script type="text/javascript">
		$(function() {
			// OPACITY OF BUTTON SET TO 0%
			$(".roll").css("opacity", "0");
			// ON MOUSE OVER
			$(".roll").hover(function() {
				// SET OPACITY TO 70%
				$(this).stop().animate({
					opacity : .7
				}, "slow");
			},
			// ON MOUSE OUT
			function() {
				// SET OPACITY BACK TO 50%
				$(this).stop().animate({
					opacity : 0
				}, "slow");
			});
		});
	</script>
	<asset:javascript src="home/js/photo/index.js" />
	<asset:javascript src="home/js/photo/photoswipe.min.js" />
	<asset:javascript src="home/js/photo/photoswipe-ui-default.js" />
	<asset:javascript src="home/js/photo/jquery.imagesloaded.min.js" />
	<asset:javascript src="home/js/photo/jquery-imagefill.js" />
	<asset:javascript src="js/document/photoManagement.js" />
	<script>
		$('.grid-quarter').imagefill();
	</script>
</body>
</html>